<template>

  <div>

    <viewer :options="options"
            :trigger="image"
            @inited="init"
            class="viewer"
            ref="viewer"
            >

      <template slot-scope="scope">
        <img :src="scope.image" alt=""/>
      </template>

    </viewer>

  </div>

</template>


<script>

import 'viewerjs/dist/viewer.css'
import Viewer from 'v-viewer/src/component'

export default {

  name: 'KImgPreviewer',

  components: {
    Viewer
  },

  props: {
    image: {
      type: String,
      default:''
    }
  },

  data(){
    return {
      options: {
        'navbar': false,
        'movable': false
      }
    }
  },

  methods: {
    init(viewer) {
      this.$viewer = viewer;
      this.$emit('getViewer', viewer)
    },
    show() {
      this.$viewer.show();
    },

  }

}
</script>

<style scoped>

</style>